<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=3, minimum-scale=1, user-scalable=no">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate">
    <meta http-equiv="expires" content="0">
    <!-- BEGIN 全局样式 -->
    <link rel="stylesheet" href="../../lib/bootstrap-3.3.7-dist/css/bootstrap.min.css" type="text/css"/>
    <link rel="stylesheet" href="../../css/reset-diy.css" type="text/css">
    <title>设备管理</title>
</head>
<body>
<div class="container-fluid pt-20">
    <div class="col-mb-3 col-lg-3 pd-0 mb-5">
        <button class="btn-add btn btn-success"><span class="glyphicon glyphicon-plus"></span> 新增</button>
    </div>
    <div class="total f-r f-14">共 <span class="num">0</span> 条</div>
    <table id="table-device" class="table table-bordered  table-hover text-center">
        <thead>
        <tr class="text-c">
            <th class="text-c">序号</th>
            <th class="text-c">mac</th>
            <th class="text-c">分组</th>
            <th class="text-c">部署位置</th>
            <th class="text-c">配置服务器</th>
            <th class="text-c">数据服务器</th>
            <th class="text-c">操作</th>
        </tr>
        </thead>
        <tbody>
        <!--
        <tr>
            <td width="50">1</td>
            <td>DZ18000000000W5500</td>
            <td>大门</td>
            <td>大门左侧</td>
            <td class="status"><span class="c-success">在线</span></td>
            <td><span class="c-success">正常</span></td>
            <td>
                <a href="javascript:void(0)" class="btn-reset" data-id="1"><span
                        class="btn-reset glyphicon glyphicon-edit" style="margin-top:-4px;vert-align: middle"></span>
                    编辑</a>
                <a href="javascript:void(0)" class="btn-reset ml-10" data-id="1"><span
                        class="btn-reset glyphicon glyphicon-refresh" style="margin-top:-4px;vert-align: middle"></span>
                    删除</a>
            </td>
        </tr>
        -->
        </tbody>
    </table>
    <div id="paging-bar" style="text-align:center;margin-top: 15px;"></div>
</div>

<!--核心脚本sss-->
<script src="../../lib/jquery/1.9.1/jquery.js" type="text/javascript" charset="utf-8"></script>
<!--[if lt IE 9]>
<script src="../../js/excanvas.min.js"></script>
<script src="../../js/respond.min.js"></script>
<![endif]-->
<!--加密插件sss 必须放在jquery.myPlugIn_v1.0.js前面-->
<script src="../../js/common/jsrsasign-all-min.js" type="text/javascript" charset="utf-8"></script>
<script src="../../js/common/crypto-js.min.js" type="text/javascript" charset="utf-8"></script>
<!--加密插件eee-->

<!--<script src="../../js/bootstrap.min.js" type="text/javascript"></script>-->
<!--<script src="../../js/jquery.cookie.min.js" type="text/javascript"></script>-->
<script src="../../lib/layer/2.4/layer.js" type="text/javascript" charset="utf-8"></script>
<script src="../../lib/laypage/1.2/laypage.js" type="text/javascript" charset="utf-8"></script>
<script src="../../js/work-box.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../../js/common/jquery.myPlugIn_v1.0.js" type="text/javascript" charset="utf-8"></script>
<script>
    var T = new Extend_base();
    jQuery(document).ready(function () {
        function Device() {
            this.clickEvent();
            // this.submitEvent();
            this.getData();
        }

        Device.prototype = {
            // dataVessel: $("#dataVessel"),
            dataVessel: $("#table-device").find("tbody"),
            clickEvent: function () {
                var _this = this;
                $(".btn-add").on('click', function () {
                    T.saveSession("refresh", "false");
                    layer.open({
                        type: 2,
                        title: "详情",
                        area: ["800px", "500px"],
                        content: "device-add.html",
                        end: function () {
                            if (T.getSession("refresh") == "true") {
                                _this.getData();
                            }
                        }
                    });
                });

                // 编辑
                $("#table-device").on("click", ".btn-edit", function () {
                    var that = $(this);
                    var data = {
                        mac: that.data("mac"),
                        type: that.data("type"),
                        position: that.data("position"),
                        id: that.data("id")
                    };
                    console.log("data: ", data);
                    T.saveSession("editData", data);
                    T.saveSession("refresh", "false");
                    layer.open({
                        type: 2,
                        title: "详情",
                        area: ["800px", "500px"],
                        content: "device-edit.html",
                        end: function () {
                            if (T.getSession("refresh") == "true") {
                                _this.getData();
                            }
                        }
                    });
                });

                // 删除
                $("#table-device").on("click", ".btn-delete", function () {
                    var data = {
                        id: $(this).data("school_id"),
                        tb_id: $(this).data("id")
                    };
                    var that = $(this);
                    T.ajaxTbManagePaging(url_join("admin/tanba/delete"), "post", data, function (res) {
                        layer.msg("操作成功", {icon: 1});
                        that.parents("tr").remove();
                    });
                });

                // show data
                $('#table-device').on('click', '.tb-mac', function () {
                    var text = $(this).text();
                    var group = $(this).next().text();
                    var position = $(this).next().next().text();
                    T.saveSession('tbMac', text);
                    window.parent.layer.open({
                        type: 2,
                        title: '当前探霸: '+text+' 位置: '+group+'-'+position,
                        area: ['100%', '100%'],
                        content: "../deviceManage/device-show.html",
                        end: function () {
                            // 智能刷新
                            var refresh = window.sessionStorage.getItem("refresh");
                            if (refresh == "true") {
                                window.location.reload();
                            }
                        }
                    });
                    // 取消按钮
                    // var index = parent.layer.getFrameIndex(window.name);
                    // parent.layer.close(index);


                });
            },
            getData: function () {
                var _this = this;
                _this.dataVessel.html("<tr><td colspan='7'><div class='text-center mt-25 mb-25 f-16'>正在获取数据...</div></td></tr>");
                var url, param, method;
                url = url_join("admin/tanba/list");
                method = "post";
                param = {id: T.getLocal("nId"), limit: 30};

                T.ajaxTbManagePaging(url, method, param, function (res) {
                    var data = typeof res == "object" ? res.data : {};
                    if (data.items.length > 0) {
                        _this.render(data);

                        T.pagingAll(
                            {
                                bar: 'paging-bar',
                                sum: data.total_pages,
                                callback: function (obj) {
                                    param.page = obj.curr;
                                    T.ajaxTbManagePaging(url, method, param, function (res) {
                                        var data = res.data;
                                        if (data.items.length > 0) {
                                            _this.render(data);
                                        } else if (data.items.length == 0) {
                                            _this.dataVessel.html("<tr><td colspan='7'><div class='text-center mt-25 mb-25 f-16'>没有相关数据</div></td></tr>");
                                        }
                                    });
                                },
                            }
                        );
                    } else if (data.items.length == 0) {
                        $("#paging-bar").hide();
                        _this.dataVessel.html("<tr><td colspan='7'><div class='text-center mt-25 mb-25 f-16'>没有相关数据</div></td></tr>");
                    }
                });
            },
            render: function (data) {
                var _this = this;
                var vessel = $("#table-device tbody");
                vessel.html("");
                $(".total .num").text(data.total_items);

                $.each(data.items, function (i, v) {
                    var status = (v.config_status || v.status) ? '' : 'c-danger';

                    var tr = $(
                        '<tr class="' + status + '">' +
                        '<td class="' + status + '" width="50">' + (data.limit * (data.current - 1) + 1 + i) + '</td>' +
                        '<td class="tb-mac ' + status + '" style="cursor:pointer">' + v.mac + '</td>' +
                        '<td class="' + status + '">' + v.type_name + '</td>' +
                        '<td class="' + status + '">' + v.position_name + '</td>' +
                        '<td class="' + status + ' status"><span>' + (v.config_status ? '在线' : '离线') + '</span></td>' +
                        '<td class="' + status + ' status"><span>' + (v.status ? '在线' : '离线') + '</span></td>' +
                        // '<td><span class="'+status+' c-success">' + v.work_status + '</span></td>' +

                        '<td>' +
                        '<a href="javascript:void(0)" class="btn-edit" data-mac="' + v.mac + '" data-type="' + v.type + '" data-position="' + v.position + '" data-id="' + v.id + '" data-school_id="' + v.school_id + '">' +
                        '<span class="btn-reset glyphicon glyphicon-edit" style="margin-top:-4px;vert-align: middle"></span>编辑</a>' +
                        '<a href="javascript:void(0)" class="btn-delete ml-10"  data-id="' + v.id + '" data-school_id="' + v.school_id + '">' +
                        '<span class="btn-reset glyphicon glyphicon-refresh" style="margin-top:-4px;vert-align: middle"></span>删除</a>' +
                        '</td>' +
                        '</tr>'
                    );

                    vessel.append(tr);
                });
            },
        };
        new Device();
    });
</script>
</body>
</html>